/**
proxy在目标对象的外层搭建了一层拦截，外界对目标对象的某些操作，必须通过这层拦截.
var proxy = new Proxy(target, handler);
new Proxy()表示生成一个Proxy实例，target参数表示所要拦截的目标对象，handler参数也是一个对象，用来定制拦截行为
 Proxy的作用
拦截和监视外部对对象的访问
降低函数或类的复杂度
在复杂操作前对操作进行校验或对所需资源进行管理
实现私有变量

Reflect是为操作对象而提供的新API，将Object对象的属于语言内部的方法放到Reflect对象上，
即从Reflect对象上拿Object对象内部方法，比较方便，可读性更强。
 */
import React from 'react';

function ProxyCom() {
  const stu = {
    name: 'ming',
    age: 18,
  };
  const stuHandler = {
    get: function setStudent(stu: any, key: any) {
      console.log(stu, key, stu[key]);
      return stu[key];
    },
    set: function getStudent(stu: any, key: any, value: any) {
      console.log(stu, key, value);
      stu[key] = value;
      return stu[key];
    },
  };
  const stuProxy = new Proxy(stu, stuHandler);
  //    stuProxy.age;
  console.log(stuProxy.age);
  stuProxy.name = 'ning';

  // 1. Reflect.has(obj,name) 判断对象中的属性是否存在
  console.log(Reflect.has(stu, 'age'), Reflect.has(stu, 'sex')); // true false

  // 2. Reflect.set(obj,name,value)若对象中的属性存在，给其重新赋值，如不存在，给其增加新的属性并赋值，
  Reflect.set(stu, 'age', 20);
  Reflect.set(stu, 'sex', '男');
  console.log(stu); // {name: 'ning', age: 20, sex: '男'}

  // 3. Reflect.get(obj,name)若对象中的属性存在，给返回属性值，如不存在，返回undefined，
  console.log(Reflect.get(stu, 'sex')); // 男
  console.log(Reflect.get(stu, 'grade')); // undefined

  // 4 Reflect.deleteProperty(obj, name) 删除属性
  Reflect.deleteProperty(stu, 'name');
  console.log(stu); // {age: 20, sex: '男'}

  // 5.Reflect.ownKeys (target) 返回一个数组，包含对象的所有属性
  console.log(Reflect.ownKeys(stu)); // ['age','sex']

  return <div />;
}
export default ProxyCom;
